<template>
	<div class="company-password">
		<!-- 密码修改 -->
		<div class="zmlTitle">{{$t('common.leftNav.passwordMod')}}</div>
		<div class="company-password-table">
			<table>
				<tr>
					<td class="h66">{{$t('common.company.password')}}：</td>
					<td><el-input v-model="formData.oldPwd" @input="oldPwd" maxlength="16"></el-input></td>
					<td class="font12" :class="[oldShow?'red2':'h99']">{{$t('common.company.companytask6')}}</td>
				</tr>
				<tr>
					<td class="h66">{{$t('common.company.newPassword')}}：</td>
					<td><el-input v-model="formData.newPwd" @input="newPwd" maxlength="16"></el-input></td>
					<td class="font12" :class="[newShow?'red2':'h99']">{{$t('common.company.companytask6')}}</td>
				</tr>
				<tr>
					<td class="h66">{{$t('common.company.confirmPassword')}}：</td>
					<td><el-input v-model="input3" @input="twoPassword" maxlength="16"></el-input></td>
					<td class="font12 red2"><span v-if="twoShow">{{$t('common.login.twoPassword')}}</span> </td>
				</tr>
				<tr>
					<td></td>
					<td><button class="zmlBtn1 comfirmBtn" @click="bindComfirm">{{$t('common.company.confirmModification')}}</button></td>
					<td></td>
				</tr>
			</table>
		</div>
	</div>
</template>
<script>
import {reg,ajaxAdd,showToast,showToastSuccess} from '@/utils/js.js'
import {updatePwd } from '@/services/api.js'
export default{
  props:{
    type:{
      type:Number,
      default:0, //0-个人，1-企业
    }
  },
  name:'changePwd',
  data(){
    return{
      formData:{
        "newPwd": "",
        "oldPwd": "",
      },
      input3:'',
      oldShow:false,
      newShow:false,
      twoShow:false
    }
  },
	methods:{
		newPwd(e){
			console.log(e)
			if(!reg.password.test(e)){
				this.newShow = true
			}else{
				this.newShow = false
			}
		},
		twoPassword(e){
			console.log(e)
			if(this.formData.newPwd != e){
				this.twoShow = true
			}else{
				this.twoShow = false
			}
    },
    oldPwd(e){
      if(!reg.password.test(e)){
				this.oldShow = true
			}else{
				this.oldShow = false
			}
    },
		// 确认修改
		bindComfirm(){
			document.getElementsByTagName('body')[0].className = 'password'; //设置为新的
      console.log('this.type',this.type)
			let data = this.formData
			let newShow = reg.password.test(data.newPwd)
			if(data.oldPwd.length<5){
				this.oldShow = true
			}else if(!newShow){
				this.newShow = true
			}else if(data.newPwd != this.input3){
				this.newShow = true
      }else{
        ajaxAdd(this,updatePwd,data,res=>{
					this.$alert( this.$t('common.status.changPwd'), this.$t('common.status.pwdTip'), {
						confirmButtonText: this.$t('common.operate.confirm'),
						callback: (e) => {
							console.log(e)
							if(e == 'confirm'){
								document.getElementsByTagName('body')[0].className = ''; //设置为新的
								this.$store.dispatch('exit','')
								this.$router.push('/login')
							}
							if(e == 'cancel'){
								document.getElementsByTagName('body')[0].className = ''; //设置为新的
							}
						}
					});
					// showToastSuccess(this,res.msg)
					
          // if(this.type == 0){
          //   this.$router.push('/vip/p_policy')
          // }else{
          //   this.$router.push('/vip/c_policy_declaration')
          // }
				},err=>{
					// showToast(this,err.msg)
				})
      }
		}
	}
}
</script>
<style lang="scss">
.password .el-message-box{width: 270px;}
.password .el-message-box,.el-message-box__btns{text-align: center;}
.company-password{
	background-color: #fff;
	min-height: 890px;
	padding: 0 30px;
	.company-password-table{
		padding-left: 13px;
		table{
			td{
				padding: 6px 0;
			}
			input{
				width: 300px;
				margin-right: 14px;
			}
			button{
				width: 300px;
				height: 34px;
				background:rgba(15,84,188,1);
				color: #fff;
				margin-top: 24px;
			}
		}
	}
	
}
</style>
